<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>
    <button onclick='test()'>test</button>
    <!-- data-main指定主代码所在的脚本文件
       src指定requirejs所在的脚本文件 -->
    
    <script src='../resource/require.js' defer async='true' data-main="../resource/main" ></script>
    <!-- async属性表明这个文件需要异步加载，避免网页失去响应。IE不支持这个属性，只支持defer，所以把defer也写上。 -->
    <script>

        /*
               require(['moduleA', 'moduleB', 'moduleC'], function (moduleA, moduleB, moduleC){

    　　　　// some code here

    require()函数接受两个参数。第一个参数是一个数组，表示所依赖的模块，
    上例就是['moduleA', 'moduleB', 'moduleC']，即主模块依赖这三个模块；第二个参数是一个回调函数，
    当前面指定的模块都加载成功后，它将被调用。加载的模块会以参数形式传入该函数，从而在回调函数内部就可以使用这些模块。
    
    　　});
    */
        function test() {
                require(['../lib/jquery.js'], function ($) {
                $('body').css({
                    'backgroundcolor': 'red'
                })
            })
        }
    </script>
</body>

</html>